<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>请假审批</title>
</head>
<body>
<style type="text/css">
	.kq-index-body1{
		padding: 20px;
    	background-color: #f3f3f3;
    	padding-bottom: 30px;
	}
	.kq-index-body2{
		width: 100%;
	    height: 100%;
	    background-color: #fff;
	}
	.kq-index-body3{
		min-width: 950px;
	    padding: 20px;
	    position: relative;
	}
	.kq-title-left{
		display: inline-block;
	    float: left;
	    font-size: 12px;
	   	color: gray;
	}
	.kq-title-left span{
		color: #19AA8D;
	    font-size: 14px;
	    font-weight: 700;
	}
	.kq-title-left-divclike{
		background-color: #19AA8D!important;
    	color: #fff;
	}
	.kq-title-left div{
		width: 130px;
	    height: 30px;
	    margin-right: 3px;
	    border-radius: 4px 4px 0 0;
	    text-align: center;
	    cursor: pointer;
	    float: left;
	    line-height: 30px;
	    background-color: #fff;
	    margin-top: 3px;
	    font-size: 14px;
	}
	.kq-title-right{
		float: right;
	}
	.kq-title-right div{
		float: left;
		margin-right: 20px;
	}
	.kq-title-right div input{
		background-color: inherit;
		height: 22px;
	    padding: 0 4px;
	    font-size: 12px;
	    border-radius: 2px;
	    border: 1px solid #eee;
	}
	.kq-title-right-kq-btn{
		padding: 2px 8px 1px 8px;
    	font-size: 12px;
    	border-radius: 3px;
    	color: #666;
    	background-color: #fff;
    	border-color: #13826b1c!important;
    	border-color: #e5e6e7;
	}
	.datagrid-header-row td{
		background: #6666661a;
		color: #19AA8D;
	    font-size: 14px;
	    font-weight: 700;
	    text-align: center;
	}
	.datagrid-row td{
		background: #fff;
		font-size: 12px;
		text-align: center;
	}
	ul{
		list-style:none;
		margin: 0px;
	}
	.top-se>li,.date-search{
	float:left;
	padding-right: 5px;
    padding-left: 5px;
	}
	.top-se span{
		font-size: 12px;
		color: gray;
	}
	.kq-btn3{
		margin-right: 10px;
    	border-radius: 4px;
    	cursor: pointer;
    	background-color: #19AA8D!important;
    	color: #fff!important;
    	border-color: #13826b33!important;
    	border: 1px solid transparent;
	}
	.body-kq-table2{
		display: none;
	}
	.textbox{
		height: 25px;
	}
</style>
<script type="text/javascript">
$(function(){
	//初始化表格
	$('#kq-table1').datagrid({
		url:'leave_selectAll',
		singleSelect:true,
		columns:[[
   	 		{field:'L_ID',hidden:true},
   	 		{field:'L_SHEN',hidden:true},
   	 		{field:'sortable',title:'#',width:28,align:'center'},
			{field:'Staff_name',title:'姓名',width:80,align:'center'},
			{field:'depart_name',title:'部门',width:80,align:'center'},
			{field:'L_DATE',title:'申请时间',width:100,align:'center',
				formatter:function(val,rec){
					return formattime(val);
		        	}	
			},
			{field:'L_KAI',title:'开始时间',width:160,align:'center',
				formatter:function(val,rec){
				return formattime(val);
	        	}
			},
			{field:'L_JIE',title:'结束时间',width:160,align:'center',
				formatter:function(val,rec){
					return formattime(val);
		        }
			},
			{field:'LT_NAME',title:'请假类型',width:100,align:'center'},
			{field:'l_sta',title:'审批状态',width:60,align:'center'},
			{field:'l_xtype',title:'请假薪型',width:100,align:'center'},
			{field:'L_WHY',title:'申请理由',width:200,align:'center'},
			{field:'caozuo',title:'操作',width:100,align:'center',
				formatter: function(value,row,index){
					if(row['L_SHEN']==0){
						return "<button class='kq-btn3' id='btn-guo' onclick='guo("+row['L_ID']+",1)'>通过</button><button class='kq-btn3' id='btn-guo' onclick='guo("+row['L_ID']+",2)'>驳回</button>";
					}else{
						return "<button class='kq-btn3' id='btn-xiang' onclick='xiang("+row['L_ID']+")'>查看</button>";
					}
				},
			}
   	 	]],
	    pagination:true,
	    pageNumber:1,
	    pageSize:5,
	    pageList:[5,10,15]
	});
	$('#kq-table2').datagrid({
		url:'',
	    pagination:true,
	    pageNumber:1,
	    pageSize:5,
	    pageList:[5,10,15]
	});
	$(".kq-title-left").children().click(function(){
		$(".kq-title-left").children().removeClass("kq-title-left-divclike");
		$(this).addClass("kq-title-left-divclike");
	});
	$(".kq-title-left-div1").click(function(){
		$(".body-kq-table2").hide();
		$(".body-kq-table1").show();
	});
	$(".kq-title-left-div2").click(function(){
		$(".body-kq-table1").hide();
		$(".body-kq-table2").show();
	});
	$(".kq-title-left-div1").addClass("kq-title-left-divclike");
});
function guo(id,shen){
	$("#form").form('load','leave_shen?id='+id+'&&shen='+shen);
	$("#content-admin").panel('open').panel('refresh','kq-leave-assessor');
	
}
function xiang(id){
	$("#content-admin").panel({
		href:"kq-leave-cha?id="+id
	});
}
function formattime(value,row,index){
	var date = new Date(value);
	        var year = date.getFullYear().toString();
	        var month = (date.getMonth() + 1);
	        var day = date.getDate().toString();
	        var hour = date.getHours().toString();
	        var minutes = date.getMinutes().toString();
	        if (month < 10) {
	            month = "0" + month;
	        }
	        if (day < 10) {
	            day = "0" + day;
	        }
	        if (hour < 10) {
	            hour = "0" + hour;
	        }
	        if (minutes < 10) {
	            minutes = "0" + minutes;
	        }
	       
	        return year + "-" + month + "-" + day + " " + hour + ":" + minutes ;
}
</script>
<div class="kq-index-body1">
	<div class="kq-index-body2">
			<div class="kq-index-body3">
				<div class="title">
					<div class="kq-title-left"> 
						<div class="kq-title-left-div1">请假审批</div>
						<div class="kq-title-left-div2">请假补录审批</div>
					</div>
					<div class="kq-title-right"> 
						<ul class="top-se">
							<li></li>
							<li><span>开始时间</span></li>
							<li><input id="kq-title-right-input1" type="text" class="easyui-datebox" required="required" style="width:150px" placeholder="请选择部门"></li>
							<li><span>至</span></li>
							<li><input id="kq-title-right-input2" type="text" class="easyui-datebox" required="required" style="width:150px" placeholder="请输入员工姓名"></li>
							<li><button class="kq-title-right-kq-btn">搜索</button></li>
						</ul>
				</div>
			</div>
				<div class="body-kq-table1">
					<table id="kq-table1" class="easyui-datagrid" data-options="width:1023,fitColumns:true,height:300">
					</table>
					</div>
					<div class="body-kq-table2">
					<table id="kq-table2" class="easyui-datagrid" data-options="width:1023,fitColumns:true,height:300">
					    <thead>
							<tr>
								<th data-options="field:'one',width:50">#</th>
								<th data-options="field:'tow',width:50">姓名</th>
								<th data-options="field:'three',width:50">部门</th>
								<th data-options="field:'four',width:150">申请时间</th>
								<th data-options="field:'five',width:250">开始时间</th>
								<th data-options="field:'six',width:250">结束时间</th>
								<th data-options="field:'eight',width:100">请假类型</th>
								<th data-options="field:'nixt',width:50">审批状态</th>
								<th data-options="field:'ss',width:150">申请理由</th>
								<th data-options="field:'no',width:150">未申请理由</th>

								<th data-options="field:'zzz',width:100">操作</th>
							</tr>
					    </thead>
					    <tbody>
					    	<tr>
					    		<td>1</td>
					    		<td>周俊</td>
					    		<td>人事部</td>
					    		<td>2018-12-14</td>
					    		<td>2018-12-15</td>
					    		<td>2019-3-15</td>
					    		<td>产假</td>
					    		<td>未审核</td>
					    		<td>要生娃了</td>
					    		<td>未知</td>
					    		<td><button class="kq-btn3">通过</button><button class="kq-btn3">驳回</button></td>
					    	</tr>
					    </tbody>
					</table>
				</div>
			</div>
		</div>
		<Form action="" id="form" method="post">
		
		</Form>
	</div>

</body>
</html>